<template>
    <div class="">
        <div class="system-user-search mb15">
				<el-input size="default" placeholder="请输入患者名称或id" v-model="nameandid" style="max-width: 180px"> </el-input>
				<el-button size="default" type="primary" @click="list()" class="ml10">
					<el-icon>
						<ele-Search />
					</el-icon>
					查询
				</el-button>
				<el-button size="default" type="success" @click="onOpenAddPati()" class="ml10">
					<el-icon>
						<ele-FolderAdd />
					</el-icon>
					新增手术记录
				</el-button>
			</div>
      <el-table
    :data="pagination.records"
    border 
    style="width: 100%">
    
    <el-table-column  fixed prop="patients.ptCard"  label="病人编号"   width="250"></el-table-column>
    <el-table-column fixed prop="patients.ptName" label="病人姓名"    width="120"> </el-table-column>
    <el-table-column fixed  prop="horCard"  label="记录编号"   width="250"></el-table-column>
     <el-table-column  prop="operationType.hoyName"  label="手术类型"   width="250">  </el-table-column>
    <el-table-column  prop="horPrice" label="手术金额"    width="200"> </el-table-column>
    <el-table-column  prop="horCreateTime"  label="手术时间"   width="300">  </el-table-column>
      <el-table-column  prop="sysUser.userName"  label="医生名字"   width="180">  </el-table-column>
    <el-table-column fixed="right"  label="操作" width="100">
      <template slot-scope="scope">
     <el-button @click="del(scope.row)"  type="text" size="small">删除</el-button>
    <el-button type="text" size="small" @click="upPatiUI(scope.row)">编辑</el-button>
      </template>
    </el-table-column>
  </el-table>
  <div class="block">
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :hide-on-single-page="true"
      :current-page="pagination.current"
		  :page-sizes="[3,5,8,10]"
		  :page-size="pagination.size"
		  layout="total,sizes, prev, pager, next, jumper"
		  :total="pagination.total">
    </el-pagination>
  </div>

  <el-dialog title="修改消费" :visible.sync="addTag" :close-on-click-modal="false">
			  <el-form :model="addRecordForm" size="small" label-width="90px">
				<el-row :gutter="35">

                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
					<el-form-item label="选择患者">
						<el-select v-model="addRecordForm.ptId" placeholder="请选择" style="width:100%">
                            <el-option
                            v-for="item in patientsData"
                            :key="item.ptId"
                            :label="item.ptName"
                            :value="item.ptId">
                            </el-option>
                        </el-select>
						</el-form-item>
		      </el-col>

           <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="手术类型">
							<el-select v-model="addRecordForm.hoyId" placeholder="请选择"  style="width:100%"  >
            <el-option
             v-for="item in operationTypeData"
              :key="item.hoyId"
              :label="item.hoyName"
              :value="item.hoyId">
            </el-option>
           </el-select>
						</el-form-item>
					</el-col>


	         <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="付费状态">
							<el-switch v-model="addRecordForm.horStatus" active-value="y" inactive-value="n" inline-prompt active-text="是" inactive-text="否"></el-switch>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="onCancel" size="default">取 消</el-button>
					<el-button type="primary" @click="onSubmit" size="default">新 增</el-button>
				</span>
			</template>
			</el-dialog>



  <el-dialog title="添加消费" :visible.sync="addTag" :close-on-click-modal="false">
			  <el-form :model="addRecordForm" size="small" label-width="90px">
				<el-row :gutter="35">

                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
					<el-form-item label="选择患者">
						<el-select v-model="addRecordForm.ptId" placeholder="请选择" style="width:100%">
                            <el-option
                            v-for="item in patientsData"
                            :key="item.ptId"
                            :label="item.ptName"
                            :value="item.ptId">
                            </el-option>
                        </el-select>
						</el-form-item>
		      </el-col>

           <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="手术类型">
							<el-select v-model="addRecordForm.hoyId" placeholder="请选择"  style="width:100%"  >
            <el-option
             v-for="item in operationTypeData"
              :key="item.hoyId"
              :label="item.hoyName"
              :value="item.hoyId">
            </el-option>
           </el-select>
						</el-form-item>
					</el-col>


	         <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="付费状态">
							<el-switch v-model="addRecordForm.horStatus" active-value="y" inactive-value="n" inline-prompt active-text="是" inactive-text="否"></el-switch>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="onCancel" size="default">取 消</el-button>
					<el-button type="primary" @click="onSubmit" size="default">新 增</el-button>
				</span>
			</template>
			</el-dialog>


    </div>
</template>

<script>
import record from '@/api/record';
export default {
    name: "doctList",
    methods:{
      //分页
        handleSizeChange(value) {
          this.pagination.size = value
          this.list(this.pagination.current,this.pagination.size);
       },
        handleCurrentChange(value) {
          this.pagination.current = value
          this.list(this.pagination.current,this.pagination.size);
       },
       del(pat){
         this.$confirm('此操作将永久删除名字为'+pat.patients.ptName+'的用户, 是否继续?', '提示', {
                    type: 'warning'
                    }).then(() => {
                        record.delRecord(pat.horId).then(resp=>{
                             this.$message({type: 'success',message: resp.message});
                           this.list();
                        })
                    }).catch(() => {
                       this.$message({type: 'info',message: '已取消删除'});          
                    });
       } ,
           // 打开新增用户弹窗
		  onOpenAddPati() {
             record.getListDto().then(resp=>{
                this.patientsData=resp.packageList
                this.operationTypeData=resp.operationTypeList;
             })
            this.addTag=true;
        },
      // 关闭新增用户弹窗
      onCancel () {
          this.addTag = false;
          this.addRecordForm={};
      },
    
      list(pageym=1,pagesize=8){
            record.findRecord(pageym,pagesize,this.nameandid).then(resp=>{
               this.pagination=resp;
            });
        },
          //添加提交
    	onSubmit() {
        this.addRecordForm.wid=this.$store.state.userInfos.userInfos.user.userId
       record.addOptype(this.addRecordForm,this.drugvalue).then(resp=>{
        this.$message({type: 'success',message: resp.message});
            		this.addTag=false;
                this.addRecordForm={};     
            		this.list();
       })
    },
    },
        data() {
      return {
        pagination:{},//分页对象
        nameandid:"",
        addTag:false,//是否显示添加弹窗
        addRecordForm:{},//添加
        operationTypeData:{},//科室列表
        patientsData:{},//患者列表
      }
        }
    ,  
    mounted() {
        this.list(1,8);
    },
}
</script>

<style  scoped>
</style>
